<template>
  <view class="coupon-center-container">
    <view class="coupon-tabs">
      <view class="coupon-tab active">全部(4)</view>
      <view class="coupon-tab">待使用(2)</view>
      <view class="coupon-tab">已使用(1)</view>
      <view class="coupon-tab">已过期(1)</view>
    </view>
    <view class="coupon-list">
      <view class="coupon-item">
        <image class="coupon-icon" src="/static/coupon-gold.png" />
        <view class="coupon-info">
          <view class="coupon-title">希乐酒店</view>
          <view class="coupon-desc">满200件减50</view>
          <view class="coupon-date">有效期：2023-10-12 至 2023-12-12</view>
        </view>
        <view class="coupon-action">立即使用</view>
        <view class="coupon-expire">3天后过期</view>
      </view>
      <!-- 其它卡券... -->
    </view>
  </view>
</template>

<script>
export default {
  name: 'CouponCenter',
  data() {
    return {};
  }
};
</script>

<style src="./coupon.css"></style> 